<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        *{padding:0;margin:0;}
        textarea{
            width: 200px;
            height: 200px;
            margin-top:50px;
            margin-left:500px;
            resize:none;
            background-color:#ccc;
            text-align:center;
            font:50px/200px 华文行楷;
            color:#000;
        }
    </style>
</head>
<body>
<textarea>0</textarea>
<script>
//    鼠标滚轮控制输入框里数字变化（向上滚动缩小数字，向下滚动增大数字）
    var text=document.getElementsByTagName("textarea")[0];
    mouseScroll(text,function(){
        text.value--;
    },function(){
        text.value++;
    })
    // 鼠标滚轮事件兼容
    function mouseScroll(obj,topFn,bottomFn){
        //火狐浏览器监听
        if(window.navigator.userAgent.indexOf("Firefox")>=0){
            obj.addEventListener("DOMMouseScroll",function (ev){
                ev = ev || event;
                where(ev) ? topFn() : bottomFn();
                //取消火狐浏览器的默认样式
                ev.preventDefault();
            },false);
        }else{
            //IE浏览器的事件监听
            obj.onmousewheel = function (ev){
                ev = ev || event
                where(ev) ? topFn() : bottomFn();
                //取消IE浏览器的默认样式
                return false;
            }
        }
    }
    function where(ev){
        var b = true;
        if(ev.wheelDelta){
            b = ev.wheelDelta>0 ? true : false;
        }else{
            b = ev.detail<0 ? true : false;
        }
        return b;
    }


</script>
</body>
</html>